import React from "react"
import Taro from "@tarojs/taro"
import clsx from "clsx"
import { View } from "@tarojs/components"

type IProps = {
  color?: React.CSSProperties["color"]
  size?: number
  className?: string
}
const Dot: React.FC<IProps> = (props: IProps) => {
  const { color = "#FF3221", size = 12, className } = props
  const width = Taro.pxTransform(size)
  return (
    <View
      className={clsx("rounded-1 inline-block", className)}
      style={{
        backgroundColor: color,
        width,
        height: width
      }}
    ></View>
  )
}
export default Dot
